<script setup lang="ts">

import {onMounted, ref} from "vue";
import {NButton} from "naive-ui";
import {clone} from "../../../utils";

let formData = ref({
  id: '',
  store: '',
  hotline: '',
  address: ''
})

const handleSaveClick = () => {
  window.electron.ipcRenderer.invoke("renderer-to-main", {
    name: 'app-global-save',
    event: 'event',
    data: clone(formData.value)
  })
}

const loadGlobal = () => {
  window.electron.ipcRenderer.invoke("renderer-to-main", {
    name: 'app-global-get',
    event: 'event',
    data: null
  })
}

onMounted(() => {
  window.electron.ipcRenderer.on('main-to-renderer', (e, data) => {
    const event = data.data
    if(data.name === 'global-get-success'){
      if(event){
        formData.value = event
      }
    }else if(data.name === 'global-operator-success'){
      window.$message.success(event);
      loadGlobal()
    }
  })
  loadGlobal()
})
</script>

<template>
<div>
  <n-form ref="loyaltyFormRef" :label-width="80" :model="formData" size="small">
    <n-grid x-gap="24" :cols="1">
      <n-gi>
        <n-form-item label="店铺名称" path="store">
          <n-input v-model:value="formData.store" placeholder="请输入店铺名称" />
        </n-form-item>
      </n-gi>
      <n-gi>
        <n-form-item label="热线电话" path="hotline">
          <n-input v-model:value="formData.hotline" placeholder="请输入热线电话" />
        </n-form-item>
      </n-gi>
      <n-gi>
        <n-form-item label="经营地址" path="address">
          <n-input type="textarea" v-model:value="formData.address" placeholder="请输入经营地址" />
        </n-form-item>
      </n-gi>
    </n-grid>
    <div class="dreamer-modal-footer">
      <n-space>
        <n-button type="primary" size="small" attr-type="button" @click="handleSaveClick">保存</n-button>
      </n-space>
    </div>
  </n-form>
</div>
</template>

<style scoped lang="less">
:deep(.n-form-item-label){
  color: #333333 !important;
}
</style>
